<template>             
   <div class="wrapper">
        <van-tabs background="rgb(79, 192, 141)" line-height="0px"  title-active-color="rgb(104, 84, 65)" @click="onClick" sticky>
            <van-tab  title="热销">
                 <TabItemOne  v-for="(product1,index) in Tab_list[0]" 
                          :product1="product1"
                          :key="product1.vid"
                 />
             </van-tab>
             <van-tab  title="新品">
               <TabItemTwo  v-for="(product2,index) in Tab_list[1]" 
                          :product2="product2"
                          :key="product2.vid"
                 />
             </van-tab>
             <van-tab  title="打折">
               <TabItemThree  v-for="(product3,index) in Tab_list[2]" 
                          :product3="product3"
                          :key="product3.vid"
                 />
             </van-tab>
        </van-tabs>
   </div>
</template>
<script>
import TabItemOne from './TabItemOne'
import TabItemTwo from './TabItemTwo'
import TabItemThree from './TabItemThree'
import { Toast } from 'vant';
import { Tab, Tabs } from 'vant';
export default {
      name:"Tab",
      
      data(){
         return {
             product1:'',
             product2:'',
             product3:''
         };
      },
     
      props:{
         Tab_list:Array
        },

       components:{
           TabItemOne,
           TabItemTwo,
           TabItemThree
        },

      methods: {
        onClick(name, title) {
           // console.log(name,title);
           // if (name==0) {
           //     this.list = this.Tab_list[0];
           //     console.log(this.list);
           // }else if(name==1){
           //     this.list = this.Tab_list[1];
           //     console.log(this.list);
           // }else if (name==2) {
           //     this.list = this.Tab_list[2];
           //     console.log(this.list);
           // }

        }, //---onClick  
         
      }
};
</script>
<style  lang="less" scoped>
 .wrapper {
            padding-top: 0.9375rem;
            background: #FFF;
            padding-bottom: 0.9375rem;
        }


</style>